﻿<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/aui.css" />
    <link rel="stylesheet" type="text/css" href="~/css/aui.css" />
    <style type="text/css">
        .header {
            padding: 2.5rem 0.5rem 2rem 0.5rem;
        }
    </style>
</head>
<body>
    <header class="aui-bar aui-bar-nav aui-text-left header" id="header">
        <br />
        <h1> <a class="aui-btn aui-pull-right" tapmode="tapmode" onClick="openClub()"> 欢迎，@ViewData["account"]<em class="aui-iconfont aui-icon-my"></em></a> 我的预约</h1>
    </header>
    <div class="aui-tab" id="tab">
        <div id="item1" class="aui-tab-item aui-active" onClick="itemclick(1)">待取号预约</div>
        <div id="item2" class="aui-tab-item" onClick="itemclick(2)">已取号预约</div>
        <div id="item3" class="aui-tab-item" onClick="itemclick(3)">失效预约</div>
    </div>
    <div class="aui-content aui-margin-b-15">
        <ul class="aui-list aui-form-list">
            <li class="aui-list-header"><div class="aui-label aui-label-primary" align="left">点击预约查看详细信息</div></li>
        </ul>
        <section class="aui-content">
            <div class="aui-card-list">
                @model IEnumerable<Mydbo>
                @foreach (var item in Model)
                {

                    <a href="/Vip/MyDetial?username=@item.username&userage=@item.userage&createtime=@item.createtime&classname=@item.classname&classplace=@item.classplace&date=@item.date&doctorname=@item.doctorname&time=@item.time&status=@item.status&id=@item.id&tell=@item.tell">
                        <div class="aui-card-list-header aui-card-list-user aui-border-b" name="@item.status" @if (item.status == 4 || item.status == 2) { @: style="display: none;"
                             }>
                            <div class="aui-list-item-inner aui-list-item-arrow">
                                <div class="aui-card-list-user-avatar">
                                    <img src="~/image/@item.id
.jpg" class="aui-img-round" />
                                </div>
                                <div class="aui-card-list-user-name">
                                    <div>
                                        @item.classname&nbsp;&nbsp;&nbsp;@item.doctorname
                                        医生
                                    </div>
                                    <small>
                                        @item.date &nbsp;&nbsp;
                                        @switch (item.time.ToString())
                                        {
                                            case "1":
                                                @:上午 &nbsp;&nbsp;8：00-9：00
                                                break;
                                            case "2":
                                                @:上午&nbsp;&nbsp;9：00-10：00
                                                break;
                                            case "3":
                                                @:上午&nbsp;&nbsp;10：00-11：00
                                                break;
                                            case "4":
                                                @:上午&nbsp;&nbsp;11：00-12：00
                                                break;
                                            case "5":
                                                @:下午&nbsp;&nbsp;2：00-3：00
                                                break;
                                            case "6":
                                                @:上午&nbsp;&nbsp;3：00-4：00
                                                break;
                                            case "7":
                                                @:下午&nbsp;&nbsp;4：00-5：00
                                                break;
                                        }
                                    </small>
                                </div>
                                <div class="aui-card-list-user-info">@item.classplace</div>
                            </div>
                        </div>
                    </a>

                }

            </div>
            <div class="aui-card-list">    </div>
        </section>
        <ul>
            <li class="aui-list-header">以上是您的所有预约</li>
            <li>
                <div class="aui-content-padded">
                    <p><a href="/Vip/ba2d0cf27b323a48"><div class="aui-btn aui-btn-info aui-btn-block"><font color="#FFFFFF">立即预约</font></div></a></p>
                </div>
            </li>
        </ul>
    </div>
</body>
</html>
<script>
    function itemclick(num) {
        var l0 = document.getElementsByName('0');
        var l2 = document.getElementsByName('2');
        var l4 = document.getElementsByName('4');
        var i1 = document.getElementById('item1');
        var i2 = document.getElementById('item2');
        var i3 = document.getElementById('item3');

        if (num == 1) {
            i1.className = "aui-tab-item aui-active";
            i2.className = "aui-tab-item";
            i3.className = "aui-tab-item";
            for (var i = 0; i < l0.length; i++) {
                l0[i].style.display = "block";
            }
            for (var i = 0; i < l4.length; i++) {
                l4[i].style.display = "none";
            }
            for (var i = 0; i < l2.length; i++) {
                l2[i].style.display = "none";
            }
        }
        else if (num == 2) {
            i2.className = "aui-tab-item aui-active";
            i1.className = "aui-tab-item";
            i3.className = "aui-tab-item";
            for (var i = 0; i < l0.length; i++) {
                l0[i].style.display = "none";
            }
            for (var i = 0; i < l4.length; i++) {
                l4[i].style.display = "none";
            }
            for (var i = 0; i < l2.length; i++) {
                l2[i].style.display = "block";
            }
        }
        else if (num == 3) {
            i3.className = "aui-tab-item aui-active";
            i1.className = "aui-tab-item";
            i2.className = "aui-tab-item";
            for (var i = 0; i < l0.length; i++) {
                l0[i].style.display = "none";
            }
            for (var i = 0; i < l4.length; i++) {
                l4[i].style.display = "block";
            }
            for (var i = 0; i < l2.length; i++) {
                l2[i].style.display = "none";
            }
        }
    }
</script>

<script type="text/javascript" src="./script/api.js"></script>
<script type="text/javascript">
    apiready = function () {
        api.setStatusBarStyle({
            style: 'light'
        });
        api.parseTapmode();
        var header = $api.byId('header');
        var headerPos = $api.offset(header);
        var body_h = $api.offset($api.dom('body')).h;
        var header_h = $api.offset($api.byId('header')).h;
        api.openFrame({
            name: 'index_frm',
            url: './html/index_frm.html',
            bounces: true,
            rect: {
                x: 0,
                y: header_h,
                w: 'auto',
                h: 'auto'
            }
        })
    };
    function openClub() {
        var delay = 0;
        if (api.systemType != 'ios') {
            delay = 300;
        }
        api.openWin({
            name: 'club_win',
            url: './html/club_win.html',
            bounces: false,
            delay: delay,
            slidBackEnabled: true,
            vScrollBarEnabled: false,
            progress: {
                type: "page"
            }
        });
    }
    function closeWin() {
        api.closeWin({
        });
    }
</script>
